<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet/less" type="text/css" href="retask-styles.less" />
  </head>
  <body>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/1.7.7/axios.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/less.js/4.2.0/less.min.js"></script>
    <script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
    <div id="app">
      <textarea v-model="message" placeholder="消息内容"></textarea>
      <fieldset>
        <legend>发送给谁</legend>
        <input type="text" v-model="senderType" placeholder="senderType" />
        <input type="text" v-model="senderId" placeholder="senderId" />
        <button @click="startReTask()">循环通知</button>
      </fieldset>
    </div>

    <script>
      const { createApp, ref } = Vue;

      createApp({
        setup() {
         
          const message = ref("Hello vue!");
          const senderId = ref("");
          const senderType = ref("car");

          const startReTask = async () => {
            if (senderId.value && !senderType.value) {
              alert("如果全不填写则为部通知，否则type为必填，不能只发senderId");
              return;
            }
            const res = await axios.post("/ws/reTask", {
              type: senderType.value,
              id: senderId.value,
              content: message.value,
            });
            console.log(res);
          };
          // const send = () => {
          //   if (senderId.value && !senderType.value) {
          //     alert("如果全不填写则为部通知，否则type为必填，不能只发senderId");
          //     return;
          //   }
          //   ws.send(
          //     JSON.stringify({
          //       id: senderId.value,
          //       type: senderType.value,
          //       content: message.value,
          //     })
          //   );
          // };
          return {
            startReTask,
            senderId,
            senderType,
            message
          };
        },
      }).mount("#app");
    </script>
  </body>
</html>
